var newer = newer || {};
newer.gd = newer.gd || {};

newer.AppDiv = function(o) {
	this.domNode = o.domNode;
	this.naviNode = o.naviNode;

	this.appList = new newer.AppMatrix();
	this.currentApp = {};
	
	this.init();
}

newer.AppDiv.prototype = {
	init: function() {
		$("#home-navi-div").html("");
		$("#home-content-div").html("");
		
		this.addDefaultApps();
		this.update();
	}, 
	
	refresh: function() {
		this.init();
	},
	
	update: function() {
		var dapp = this.appList.getAppByTitle($.xurls({operation: "get", key: "a", url: location.pathname}));
//		if(dapp == null) {
//			dapp = this.homeApp;
//		}
		this.startApp(this,dapp,"app-content-div-0-1");
	}, 
	
	addDefaultApps: function() {
		$("#home-navi-div").append('<div style="background-color:grey;color:white;padding:2px;text-align:center;">HomePage</div>');
		
		$("#home-navi-div").append('<div id="app-icon-row-1" style="margin-top:5px;"></div>');
		this.currentRowId = "app-icon-row-1";
		
		this.homeApp = new newer.BaseApp();
		this.addApp(this.homeApp);
		this.addApp(new newer.FriendsPostsApp());
		this.addApp(new newer.CirclesPostsApp());
		this.addApp(new newer.CirclesSettingsApp({nroot:this.nroot}));
	},
	
	addApp: function(app) {
		var self = this;
		// 1. add app into appList
		this.appList.insertApp(app);
		
		// 2. set icon div
		var iconDivId = "app-icon-div-"+this.appList.tail.ioc+"-"+this.appList.tail.ior;
		$("#"+this.currentRowId).append('<div id="'+iconDivId+'" class="app-icon-div link-like-element"></div>')
		$("#"+iconDivId).html(app.getIcon());
		
		// 3. set content div
		var contentDivId = "app-content-div-"+this.appList.tail.ioc+"-"+this.appList.tail.ior;
		
		// 4. bind click button event
		$("#" + iconDivId).on("click", function() {
			if(self.currentApp != app) {
				$.debug("app starts");
				history.pushState({}, "", "/home/"+app.title+"/");
				self.startApp(self, app, contentDivId);
			}
		});	
	},
	
	startApp: function(self,app,contentDivId) {
		if(self.currentApp != app) {
			if(self.currentApp.stop){
				self.current.stop();
			}
			$("#home-content-div").html("");
			$("#home-content-div").append('<div id="'+contentDivId+'" style="width:100%;height:100%;display:none;"></div>')
			$("#"+contentDivId).html(app.getContent());
			$("#" + contentDivId).show();

			self.currentApp = app;
			app.init();
		}
	},
	
	removeApp: function(app) {
		$("#" + app.name).remove();
		//remove the app object from array
	}
}

newer.AppMatrix = function(o) {
	this.length = 0;
	this.head = null;
	this.tail = null; // tail is pointer to the last one
	this.noc = 3;	// number of columns
	
	this.insertApp = function(app) {
		var appNode = new newer.AppNode({app:app});
		
		if(this.length == 0) {
			this.length = 1;
			this.head = appNode;
			this.tail = appNode;
			appNode.next = null;
		} else {
			this.length++;
			this.tail.next = appNode;
			this.tail = appNode;
			this.tail.next= null;
			
			this.tail.ioc = this.length % this.noc;
			this.tail.ior = Math.floor(this.length / this.noc);
		}
	};
	
	this.getAppByIndex = function(i) {
		if(i >= this.length) {
			return null;
		}
		if(i == 0) {
			return this.getAppFromAppNode(this.head);
		} else {
			var j = i;
			var node = this.head;
			while(j > 0) {
				j--;
				node = node.next;
			}
			return this.getAppFromAppNode(node);
		}
	};
	
	this.getAppFromAppNode = function(appNode) {
		if(appNode == null || appNode.app == null) {
			return null;
		} else {
			return appNode.app;
		}
	};
	
	this.getAppByTitle = function(title) {
		var i = this.length;
		var node = this.head;
		while(i > 0) {
			i--;
			var app = this.getAppFromAppNode(node);
			if(app != null) {
				if(app.title == title){
					return app;
				}
				node = node.next;
			} else {
				break;
			}	
		}
		return this.head.app;
	} 

}

newer.AppNode = function(o) {
	this.app = o.app;
	this.next = null;
	this.ioc = 0;	// index of column
	this.ior = 0;	// index of row
}
